<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <title>CSS_伪类选择器_元素伪类</title>
  <style>
      /*给仅第一个字符设定样式*/
      h2::first-letter{
          font-size: 50px;
          color: red;
      }

      /*给第一行内容上样式*/
      h2::first-line{
          font-size: 100px;
          color: blue;
      }

      /*给内容开头上样式*/
      h2::before {
          content: "【开头】";
          color: green;
      }
      /*给内容结尾上样式*/
      h2::after {
          content: "【结尾】";
          color: purple;
      }
  </style>
</head>
<body>
    <!--伪元素：不是真正的 DOM 元素，而是浏览器创建的虚拟容器，用于对某些特定部分应用样式。是虚拟用特殊方式进行包裹了一下吗？-->
    <h2>
        测试lorme ipsum dolor sit amet, consectetur adipisicing elit. Voluptas, voluptate, voluptates, voluptatibus, voluptatum, voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum voluptatum volupt
    </h2>
</body>
</html>